import React, { Component } from 'react'
import { withRouter} from 'react-router-dom'


 class Header extends Component {
    back = (id,title) => {
        this.props.history.goBack()
      }
      forward = (id,title) => {
        this.props.history.goForward()
      }
      go = (id,title) => {
        this.props.history.go(2)
      }
    render() {
        console.log('header组件收到的props',this.props)
        return (
            <div>
                  <div className="page-header">
                      <h2>React Router Demo</h2>
                      &nbsp;<button style={{display:'inline-block',float:'none'}} onClick={() => {
                            this.back()
                        }}>回退</button>
                        &nbsp;<button style={{display:'inline-block',float:'none'}} onClick={() => {
                            this.forward()
                        }}>前进</button>
                        &nbsp;<button style={{display:'inline-block',float:'none'}} onClick={() => {
                            this.go()
                        }}>go</button>
                </div>
                  
            </div>
        )
    }
}

//withRouter可以给一般组件加上路由组件的api （加工一般组件）
//withRouter的返回值是一个新组件
export default withRouter(Header)
